<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="css/all.css"/>
    <script src="js/jquery.min.js"></script>
    <script>

    </script>
</head>
<body>
<script>

</script>
<!--头部-->
<div class="header">
    <a class="logo" href="##"></a>
    <div class="desc">欢迎注册</div>
</div>
<form action="register.do" method="post" onsubmit="return testFull()">
    <!--版心-->
    <div class="container">
        <!--注册模块-->
        <div class="register">
            <!--用户名-->
            <div class="register-box">
                <!--表单项-->
                <div class="box default">
                    <label for="userName">姓名</label>
                    <input type="text" id="userName" name="name" placeholder="您的账户名"/>
                    <i></i>
                </div>

            </div>
            <!--性别-->
            <div class="register-box">
                <div class="box default">
                    <label for="sex">性别</label>
                    <input type="text" id="sex" name="sex" placeholder="请输入性别"/>
                    <i></i>
                </div>

            </div>
            <!--设置密码-->
            <div class="register-box">
                <!--表单项-->
                <div class="box default">
                    <label for="pwd">设置密码</label>
                    <input type="password" id="pwd" name="password" placeholder="建议至少两种字符组合"/>
                    <i></i>
                </div>

            </div>
            <!--确认密码-->
            <div class="register-box">
                <!--表单项-->
                <div class="box default">
                    <label for="pwd2">确认密码</label>
                    <input type="password" id="pwd2" name="again-password" placeholder="请再次输入密码"/>
                    <i></i>
                </div>

            </div>
            <!--设置邮箱-->
            <div class="register-box">
                <!--表单项-->
                <div class="box default">
                    <label for="email">邮箱</label>
                    <input type="text" id="email" name="email" placeholder="请输入邮箱"/>
                    <i></i>
                </div>

            </div>

            <!--手机验证-->
            <div class="register-box">
                <!--表单项-->
                <div class="box default">
                    <label for="mobile">手机号</label>
                    <input type="text" id="mobile" name="phone" placeholder="请输入手机号"/>
                    <i></i>
                </div>

            </div>


            <!--注册-->
            <div style="text-align: center;width: 412px; height: 54px;font-size: 30px">
                <input type="submit" value="注册"></div>
        </div>
    </div>
</form>
</body>
</html>

<script>

    // 判断注册的内容是否填写完整
    function testFull() {
        var name = $("input[name='name']").val();
        var sex = $("input[name='sex']").val();
        var password = $("input[name='password']").val();
        var againPassword = $("input[name='again-password']").val();
        var email = $("input[name='email']").val();
        var phone = $("input[name='phone']").val();

        if (name == "" || sex == "" || password == "" || againPassword == "" || email == "" || phone == "") {
            alert("注册失败,填写不完整！");
            return false;
        } else {
            return true;
        }
    }
</script>
